<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link href="css/common.css" rel="stylesheet" type="text/css"/>
    <link href="css/style.css" rel="stylesheet" type="text/css"/>
    <link href="css/user_style.css" rel="stylesheet" type="text/css"/>
    <link href="skins/all.css" rel="stylesheet" type="text/css"/>
    <script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>
    <script src="js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script>
    <script src="js/common_js.js" type="text/javascript"></script>
    <script src="js/footer.js" type="text/javascript"></script>
    <script src="js/iCheck.js" type="text/javascript"></script>
    <script src="js/custom.js" type="text/javascript"></script>
    <script src="layer/layer.js" type="text/javascript"></script>
    <!--自定义工具-->
    <script type="text/javascript" src="js/HttpUtil.js"></script>
    <!--参数校验工具-->
    <script src="validation-1.19.2/jquery.validate.min.js"></script>
    <!--本地化文件-->
    <script src="validation-1.19.2/localization/messages_zh.min.js"></script>
    <!--导入 vue 包-->
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>

    <title>用户中心-账户管理</title>
</head>

<body>


<head>
    <div id="header_top">
        <div id="top">
            <div class="Inside_pages">
                <div class="Collection"><a href="login.html" class="green">请登录</a> <a href="register.html"
                                                                                      class="green">免费注册</a></div>
                <div class="hd_top_manu clearfix">
                    <ul class="clearfix">
                        <li class="hd_menu_tit" data-addclass="hd_menu_hover"><a href="user_center.html">用户中心</a></li>
                        <li class="hd_menu_tit" data-addclass="hd_menu_hover"><a href="message_center.html">消息中心</a></li>
                        <li class="hd_menu_tit" data-addclass="hd_menu_hover"><a href="goodsList.html">商品分类</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <!--菜单栏以上-->
        <!--<div id="header"  class="header page_style">
            <div class="logo"><a href="index.html"><img src="images/logo.png" /></a></div>

            &lt;!&ndash;结束图层&ndash;&gt;
            <div class="Search">
                <div class="search_list">
                    <ul>
                        <li class="current"><a href="#">产品</a></li>
                        <li><a href="#">信息</a></li>
                    </ul>
                </div>
                <div class="clear search_cur">
                    <input name="searchName" id="searchName" class="search_box" onkeydown="keyDownSearch()" type="text">
                    <input name="" type="submit" value="搜 索"  class="Search_btn"/>
                </div>
                <div class="clear hotword">热门搜索词：香醋&nbsp;&nbsp;&nbsp;茶叶&nbsp;&nbsp;&nbsp;草莓&nbsp;&nbsp;&nbsp;葡萄&nbsp;&nbsp;&nbsp;菜油</div>
            </div>

            &lt;!&ndash;购物车样式&ndash;&gt;
            <div class="hd_Shopping_list" id="Shopping_list">
                <div class="s_cart"><a href="购物车.html">我的购物车</a> <i class="ci-right">&gt;</i><i class="ci-count" id="shopping-amount">0</i></div>
                <div class="dorpdown-layer">
                    <div class="spacer"></div>
                    &lt;!&ndash;<div class="prompt"></div><div class="nogoods"><b></b>购物车中还没有商品，赶紧选购吧！</div>&ndash;&gt;
                    <ul class="p_s_list">
                        <li>
                            <div class="img"><img src="images/tianma.png"></div>
                            <div class="content"><p class="name"><a href="#">产品名称</a></p><p>颜色分类:紫花8255尺码:XL</p></div>
                            <div class="Operations">
                                <p class="Price">￥55.00</p>
                                <p><a href="#">删除</a></p></div>
                        </li>
                    </ul>
                    <div class="Shopping_style">
                        <div class="p-total">共<b>1</b>件商品　共计<strong>￥ 515.00</strong></div>
                        <a href="Shop_cart.html" title="去购物车结算" id="btn-payforgoods" class="Shopping">去购物车结算</a>
                    </div>
                </div>
            </div>
        </div>-->

        <!--菜单栏开始-->
        <!--菜单栏-->
        <div class="Navigation" id="Navigation" style="padding-left: 420px;">
            <ul class="Navigation_name">
                <li><a href="index.html">首页</a></li>
                <li class="hour"><a href="半小时圈主页.html">半小时生活圈</a></li>
                <li><a href="产品-产品列表(预售).html">预售专区</a><em class="hot_icon"></em></li>
                <li><a href="店铺首页.html">好评商户</a></li>
                <li><a href="goodsList.html">热销活动</a></li>
                <li><a href="">联系我们</a></li>
            </ul>
        </div>

        <script>$("#Navigation").slide({titCell: ".Navigation_name li", trigger: "click"});</script>
    </div>
</head>


<!--账户管理样式-->
<div class="user_style clearfix">
    <div class="user_center clearfix">

        <!--左侧边栏-->
        <div class="left_style">
            <div class="menu_style">
                <div class="user_title"><a href="user_center.html">用户中心</div>
                <div class="user_Head">
                    <div class="user_portrait">
                        <a href="#" title="修改头像" class="btn_link"></a> <img src="images/people.png">
                        <div class="background_img"></div>
                    </div>
                    <div class="user_name">
                        <p><span class="name">化海天堂</span><a href="update_password.html">[修改密码]</a></p>
                        <p>访问时间：2016-1-21 10:23</p>
                    </div>
                </div>
                <!--菜单列表图层-->
                <div class="sideMen">
                    <dl class="accountSideOption1">
                        <dt class="transaction_manage"><em class="icon_1"></em>订单管理</dt>
                        <dd>
                            <ul>
                                <li><a href="user_order.html">我的订单</a></li>
                                <li><a href="address.html">收货地址</a></li>
                            </ul>
                        </dd>
                    </dl>
                    <dl class="accountSideOption1">
                        <dt class="transaction_manage"><em class="icon_2"></em>会员管理</dt>
                        <dd>
                            <ul>
                                <li><a href="user_information.html">用户信息</a></li>
                                <li><a href="#">我的收藏</a></li>
                                <li><a href="#">我的留言</a></li>
                                <li><a href="#">我的评论</a></li>
                            </ul>
                        </dd>
                    </dl>
                    <dl class="accountSideOption1">
                        <dt class="transaction_manage"><em class="icon_3"></em>账户管理</dt>
                        <dd>
                            <ul>
                                <li><a href="user_account_management.html">账户余额</a></li>
                                <li><a href="用户中心-消费记录.html">消费记录</a></li>
                                <li><a href="#">跟踪包裹</a></li>
                                <li><a href="#">资金管理</a></li>
                            </ul>
                        </dd>
                    </dl>
                </div>
            </div>
        </div>

        <!--右侧边栏-->
        <div class="right_style" id="user_balance">
            <div class="title_style"><em></em>账户管理</div>
            <div class="user_Account_style">
                <div class="user_Account">
                    <div class="title_name">我的账户余额：（小充钱包）</div>
                    <div class="Balance clearfix">
                        <p class="je_Balance">账户余额：<b><i>{{userBalance}}</i></b> 元 </p>
                        <p class="clearfix Account_btn">
                            <a href="user_recharge.html" class="Recharge_btn" id="Recharges_btn">充值</a>
                            <a href="recharges_record.html" class="withdraw_btn" id="cz_Records_btn">消费记录</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>


<!--网站地图-->
<div class="fri-link-bg clearfix">
    <div class="fri-link">
        <div class="logo left margin-r20"><img src="images/fo-logo.jpg" width="152" height="81"/></div>
        <div class="left"><img src="images/qd.jpg" width="90" height="90"/>
            <p>扫描下载APP</p>
        </div>
        <div class="">
            <dl>
                <dt>新手上路</dt>
                <dd><a href="#">售后流程</a></dd>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">订购方式</a></dd>
                <dd><a href="#">隐私声明 </a></dd>
                <dd><a href="#">推荐分享说明 </a></dd>
            </dl>
            <dl>
                <dt>配送与支付</dt>
                <dd><a href="#">保险需求测试</a></dd>
                <dd><a href="#">专题及活动</a></dd>
                <dd><a href="#">挑选保险产品</a></dd>
                <dd><a href="#">常见问题 </a></dd>
            </dl>
            <dl>
                <dt>售后保障</dt>
                <dd><a href="#">保险需求测试</a></dd>
                <dd><a href="#">专题及活动</a></dd>
                <dd><a href="#">挑选保险产品</a></dd>
                <dd><a href="#">常见问题 </a></dd>
            </dl>
            <dl>
                <dt>支付方式</dt>
                <dd><a href="#">保险需求测试</a></dd>
                <dd><a href="#">专题及活动</a></dd>
                <dd><a href="#">挑选保险产品</a></dd>
                <dd><a href="#">常见问题 </a></dd>
            </dl>
            <dl>
                <dt>帮助中心</dt>
                <dd><a href="#">保险需求测试</a></dd>
                <dd><a href="#">专题及活动</a></dd>
                <dd><a href="#">挑选保险产品</a></dd>
                <dd><a href="#">常见问题 </a></dd>
            </dl>
            <dl>
                <dt>帮助中心</dt>
                <dd><a href="#">保险需求测试</a></dd>
                <dd><a href="#">专题及活动</a></dd>
                <dd><a href="#">挑选保险产品</a></dd>
                <dd><a href="#">常见问题 </a></dd>
            </dl>

        </div>
    </div>
</div>
<!--网站地图END-->


<!--网站页脚-->
<div class="copyright">
    <div class="copyright-bg">
        <div class="hotline">为生活充电在线 <span>招商热线：****-********</span> 客服热线：400-******</div>
        <div class="hotline co-ph">
            <p>版权所有Copyright ©***************</p>
            <p>*ICP备***************号 不良信息举报</p>
            <p>总机电话：****-*********/194/195/196 客服电话：4000****** 传 真：********

                <a href="http://www.mycodes.net/" target="_blank">源码之家</a></p>
        </div>
    </div>
</div>


<script type="text/javascript">
    jQuery(".sideMen").slide({
        titCell: "dt", targetCell: "dd", trigger: "click",
        defaultIndex: 0, effect: "slideDown",
        delayTime: 300, returnDefault: true
    });

    /*************************页面加载*****************************/
    $(function () {
        //页面加载完毕，先判断用户是否已登录
        let userInfo = checkUserLogin();
        if (userInfo == null) {
            return;
        }
        //调用函数发起异步请求，查询账户余额
        balance_vm.getUserBalance(userInfo);
    });

    var balance_vm = new Vue({
        el: "#user_balance",
        data: {
            userBalance: 0
        },
        methods: {
            //查询用户余额
            getUserBalance: function (u) {
                console.log("userID=========");
                console.log(u.userID);
                let url = "userAccount/findUserBalanceByUserId.do";
                let params = {
                    userID: u.userID
                };
                let vue_quote = this;

                getWithParams(url, params, function (data) {
                    vue_quote.userBalance = data;
                })
            }
        }
    });
</script>


</body>
</html>
